<template>
	<view class="content">
		<view class="formBox status-wrapper boxShadow f-c-sa">
			<view  :class="statusListIndex==index?'active':''" @click="selectStatus(index)" v-for="(item, index) in statusList" v-key="index">{{ item.name }}</view>
		</view>
		<u-empty v-if="!list.length" mode="order" margin-top="200"	></u-empty>
		<view class="formBox basic-info" v-for="(item,index) in list" @click="godetail(item.activityOrderNo)">
			<view class="f-c-sb"><view class="label">状态</view><view class="value">{{item.orderStatusStr}}</view></view>
			<view class="f-c-sb"><view class="label">活动编号</view><view class="value">{{item.activityOrderNo}}</view></view>
			<view class="f-c-sb"><view class="label">活动名称</view><view class="value">{{item.activityName}}</view></view>
			<view class="f-c-sb"><view class="label">金额</view><view class="value money">￥{{item.amount}}</view></view>
		</view>
		<u-loadmore v-if="!listQuery.noData && list.length != 0" :status="'nomore'" :load-text="{ nomore: '没有更多数据了' }" />
	</view>
</template>

<script>
	import {customerRightsList} from '@/api/index'
	export default {
		data() {
			return {
				statusListIndex:0,
				statusList: [
					{
						name: '可使用',
						value: '1'
					},
					{
						name: '已使用',
						value: '2'
					},
					{
						name: '已过期',
						value: '3'
					}
				],
				listQuery: {
					pageNo: 1,
					pageSize: 20,
					customerNo: '',
					status: 1,
					noData: true
				},
				list:[],
				customerNo:''
			}
		},
		onLoad(option) {
			this.customerNo=JSON.parse(option.param).customerNo
			this.getlist()
		},
		onReachBottom() {
			if (this.listQuery.noData) {
				this.getlist();
			}
		},
		onPullDownRefresh() {
			console.log('refresh');
			this.listQuery.pageNo = 1;
			this.listQuery.noData = 1;
			this.getlist();
			setTimeout(function() {
				uni.stopPullDownRefresh();
			}, 1000);
		},
		methods: {
			selectStatus(index) {
				this.statusListIndex = index;
				this.listQuery.noData = true;
				this.listQuery.pageNo = 1;
				this.listQuery.status = Number(index)+1;
				this.getlist();
			},
			godetail(activityOrderNo){
				this.$navigateTo('./equitiesDetail',{activityOrderNo:activityOrderNo,status:this.statusListIndex})},
			getlist(){
				this.listQuery.customerNo=this.customerNo
				customerRightsList(this.listQuery).then(res=>{
					if (this.listQuery.pageNo == 1) {
						this.list = res.data;
					} else {
						this.list = this.list.concat(res.data);
					}
					this.listQuery.pageNo += 1;
					if (this.listQuery.pageSize != res.data.length) {
						this.listQuery.noData = false;
					}
				})
			}
		}
	}
</script>

<style lang="less">
.content{
	padding: 20rpx 0;
	background: #F5F5F5;
	.status-wrapper{
		padding-top: 20rpx;
		font-size: 24rpx;
		.active{
			color: #177FFF;
		}
	}
	.basic-info{
		.value{
			font-weight: bold;
			font-size: 28rpx;
			flex: 1;
			text-align: right;
			padding-left: 20rpx;
			overflow: hidden;
			white-space: nowrap;
			text-overflow: ellipsis;
		}
		.money{
			color: #FF6738;
		}
		.label{
			font-size: 28rpx;
		}
		.f-c-sb{
			padding: 30rpx 0;
			border-bottom: 1px solid #EDEDED;
		}
		.f-c-sb:last-child{
			border: none;
			padding-bottom: 15rpx;
		}
	}
}
</style>
